<template>
  <view>
    <u-gap height="80"></u-gap>
    <view class="text-center u-font-28" style="color: #999999">可提现(元)</view>
    <view class="text-center u-m-24" style="font-size: 60rpx;">10000</view>

    <u-gap height="80"></u-gap>
    <view style="width: 600rpx;margin: 0 auto;">
      <view class="flex-row align-center" style="border-bottom: 1px solid rgba(0,0,0,0.1);">
        <u-input style="width: 100%;" placeholder="请输入提现金额" type="number"></u-input>
        <my-btn :size="[86, 48, 26]" color="#AFAFAF" border="1px solid #AFAFAF" round>全部</my-btn>
      </view>
      <view class="text-right u-m-t-16" style="color: #F6AD3C">本次提现扣除0.5%手续费</view>
      <view class="u-m-t-32">提现账户</view>
      <u-gap height="80"></u-gap>
      <view class="items">
        <view class="item" :class="{ on: type == 0 }" @click="type = 0">
          <image class="radio" v-if="type == 0" src="../../static/icons/ra1.png" mode=""></image>
          <image class="radio" v-else src="../../static/icons/ra0.png" mode=""></image>
          <text>微信</text>
          <image class="pay" src="../../static/icons/wxpay.png" mode=""></image>
        </view>
        <view class="item" :class="{ on: type == 1 }" @click="type = 1">
          <image class="radio" v-if="type == 1" src="../../static/icons/ra1.png" mode=""></image>
          <image class="radio" v-else src="../../static/icons/ra0.png" mode=""></image>
          <text>支付宝</text>
          <image class="pay" src="../../static/icons/alipay.png" mode=""></image>
        </view>
      </view>
    </view>

    <u-gap height="80"></u-gap>
    <my-btn :size="[600, 70, 30]" bg="#ffb849" color="#fff" round @click="test">确定</my-btn>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        type: 0,
        str: 'test2'
      };
    },
    methods: {
      test() {
        this[this.str]()
      },
      test2() {
        console.log(123)
      }
    }
  }
</script>

<style lang="scss">
  .items {
    display: flex;
  }

  .item {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;

    text {
      margin: 0 16rpx;
    }
  }

  .radio {
    width: 28rpx;
    height: 28rpx;
  }

  .pay {
    width: 52rpx;
    height: 52rpx;
  }
</style>
